// 调用函数 动态生成页面
setPage()

// 动态生成页面
async function setPage() {

    // 获取localStorage中的goods_id
    let goods_id = localStorage.goods_id

    //根据goods_id 获取响应的数据数值
    const obj = await myPromiseJQueryAjax('../server/goods_detail.php', 'post', { goods_id: goods_id }, 'json')

    //声明变量 存储字符串数据
    let str = `
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">商品详细信息</h3>
      </div>
      <div class="panel-body">
        <div class="media">
          <div class="media-left">
            <a href="#">
              <img class="media-object" src="${obj.goods_big_logo}" alt="...">
            </a>
          </div>
          <div class="media-body">
            <h4 class="media-heading">${obj.goods_name}</h4>
            <p>
              <i class="glyphicon glyphicon-yen"></i>
              <span>${obj.goods_price}</span>
            </p>
            <div class="btn-group" role="group" aria-label="...">
              <button type="button" class="btn btn-default">XL</button>
              <button type="button" class="btn btn-default">L</button>
              <button type="button" class="btn btn-default">M</button>
              <button type="button" class="btn btn-default">S</button>
              <button type="button" class="btn btn-default">XS</button>
            </div>
            <p style="position:relative">
              <input value="1" class="num">
              <button type="button" class="jian btn btn-default">-</button>
              <button type="button" class="jia btn btn-default">+</button>
            </p>
            <p>
              <a href="javascript:;" name="shop" class="btn btn-warning btn-lg" role="button">立即购买</a>
              <a href="./cart.html" name="cart" class="btn btn-danger btn-lg" role="button">加入购物车</a>
            </p>
          </div>
        </div>
        <ul class="nav nav-tabs">
          <li role="presentation" class="active"><a href="#">商品详细信息</a></li>
          <li role="presentation"><a href="#">商品参数信息</a></li>
          <li role="presentation"><a href="#">相关商品</a></li>
        </ul>
        <div>
          ${obj.goods_introduce}
        </div>
      </div>
  </div>
  `

    // 写入数据
    $('.container').html(str)

    console.log(obj)


    //获取input框的值
    // 减号的点击事件
    $('.jian').click(function () {
        let jianNum = $('.num').val()
        jianNum > 1 ? jianNum-- : jianNum
        $('.num').val(jianNum)
    })

    // 加号的点击事件
    $('.jia').click(function () {
        let jiaNum = $('.num').val()
        jiaNum > obj.goods_number - 1 - 0 ? jiaNum : jiaNum++
        $('.num').val(jiaNum)
    })

    // 立即购买按钮
    $('[name="shop"]').click(function () {
        window.alert('支付功能未开放')
    })



    let arr = JSON.parse(localStorage.getItem('cart'))
    // 加入购物车按钮
    $('[name="cart"]').click(function (e) {

        // 阻止默认事件
        e.preventDefault()

        //判断登录状态
        if (localStorage.state === 'false') {
            window.alert('请先进行登录')
            // 阻止一切
            return false
        } else {
            arr.unshift({ goods_id: obj.goods_id, goods_small_logo: obj.goods_big_logo, goods_name: obj.goods_name, goods_price: obj.goods_price, num: $('.num').val(), goods_number: obj.goods_number, buy: false })

            localStorage.setItem('cart', JSON.stringify(arr))

            //弹窗
            if (window.confirm('加入购物车成功! 是否打开购物车')) {
                //跳转页面 并且携带参数goods_id
                window.location.href = '../pages/cart.html'
            }
        }

    })

    console.log(arr)


}

